<template>
	<view>
		<custom fixed="fixed" mode="2" title="黑名单" border="0.5px solid rgba(0,0,0,0.1)">
		</custom>
		<view class="flex flex-x-y p-20">
			<search placeholder="搜索" v-model="keyword"></search>
		</view>
		

		<!-- 成员列表 -->
		
		
	<!-- 	<view class="mt-20">
			<view class="muted" v-if="index<show_index" v-for="(item,index) in search_list" :key="item.id">
				<view class="fs-28 color-333333">{{remark_obj[item.id] || item.name }}</view>
				<view class="">
					<switch @change="checked_change(item)" :checked="checked" color="#FD7747"
						style="transform: scale(0.7) translateX(20rpx);" />
				</view>
			</view>
		</view> -->
		
		<cell-list>
			<template v-for="(item,index) in 10">
				<cell :key="index" title="张三" type="none">
					<view class="out fs-28 flex flex-x-y" slot="right" @tap.stop="out">
						移除
					</view>
				</cell>
			</template>
		</cell-list>
		<view style="height: 40rpx;"></view>
		<toast ref="toast"></toast>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				list: [

				],
				keyword: '',
				tab_index: 0,
				show_index: 20,
				checked: false,
				time: {
					day: 0,
					hour: 0,
					minute: 0
				}
			}
		},
		computed: {
			search_list() {
				if (!this.keyword.trim()) {
					return this.list;
				}
				this.show_index = 20;
				return this.list.filter(val => val.name.indexOf(this.keyword.trim()) > -1);


			}
		},
		watch: {

		},
		onShow() {

		},
		onLoad() {

			let friend = {};
			this.chat_friends.forEach(val => {
				friend[val.id] = true;
			});
			let arr = getApp().globalData.allPople || [];
			this.list = this.clone(arr).map(val => {
				if (!friend[val.id] && val.id != this.user_info.id) val.add = true;
				return val;
			});
			console.log(this.list, 'list')



		},
		onReachBottom() {
			this.show_index += 20;
		},
		methods: {

			show_user(user) {
				let friend = this.chat_friends.filter(val => val.id == user.id);
				if (friend.length > 0) {
					friend = true;
				}
				let mine = '';
				console.log('user', user, 'id', this.user_info.id)
				if (user.id == this.user_info.id) {
					mine = true;
				}
				this.toPage(`/pages/chat/user?id=${user.id}&friend=${friend}&mine=${mine}&all=${true}`);
			},

			checked_change(item) {
				console.log('checked', item);
				// console.log('e', e);
				// this.checked = e.detail.value;
				// console.log('checked', this.checked);
			},
			selet_time() {
				this.$refs.popup.open()
			},
			close() {
				this.$refs.popup.close()
			},
			out() {
				this.$refs.toast.open({
					title:'是否将该好友移出黑名单',
					
				})
			}
		},
		onPullDownRefresh() {
			setTimeout(() => {
				uni.stopPullDownRefresh();
			}, 100);

		},
	}
</script>

<style lang="scss">
	page {
		background-color: $pageColor;
	}

	.muted {
		background-color: #fff;
		padding: 24rpx 32rpx;
		display: flex;
		justify-content: space-between;
		align-items: center;
		margin-bottom: 2rpx;
	}

	.time-select {
		background-color: #fff;
		padding: 40rpx;
		border-radius: 20rpx;
	}

	.time_input {
		width: 100rpx;
		border-bottom: 1px solid #ccc;
		margin-left: 20rpx;
	}
	.out {
		padding: 0 20rpx;
		color: #9B9B9B;
		background-color: #F0F0F0;
		border-radius: 8rpx;
	}
</style>
